{% zone "Header" %}
    <!-- Page Header -->
    <!-- Set your background image for this header on the line below. -->
    {% assign imagePath = Model.ContentItem.Content.BlogPost.Image.Paths.first %}
    {% if imagePath == nil %}
        <header class="masthead" style="background-image: url('{{ "~/TheBlogTheme/img/post-bg.jpg" | href }}')">
    {% else %}
        <header class="masthead" style="background-image: url('{{ imagePath | asset_url }}')">
    {% endif %}
        <div class="overlay"></div>
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-md-10 mx-auto">
                    <div class="post-heading">
                        <h1>{{ Model.ContentItem.DisplayText }}</h1>
                        <h2 class="subheading">{{ Model.ContentItem.Content.BlogPost.Subtitle.Text }}</h2>
                        <span class="meta">
                            {% assign format = "MMMM dd, yyyy" | t %}
                            {% assign dateTime = "DateTime" | shape_new: utc: Model.ContentItem.CreatedUtc, format: format | shape_stringify %}
                            {{ "Posted by" | t }} <a href="#">{{ Model.ContentItem.Owner }}</a> {{ "on {0}" | t: dateTime | raw }}
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </header>
{% endzone %}

{{ Model.Content.ContentsMetadata | shape_render }}
{{ Model.Content.MarkdownBodyPart | shape_render }}
{{ Model.Content.BlogPost-Category | shape_render }}
{{ Model.Content.BlogPost-Tags-TaxonomyField_Display__Tags | shape_render }}
